$(document).ready(function (){
    function comment_request(){
        let page = $('#commentPage')
        $.ajax({
            url:'commentMoreAPI',
            type:'get',
            dataType:'json',
            headers:{
                    "X-CSRFToken": window.CSRF_TOKEN
            },
            data:{
                'page':Number(page.val()) + 1,
                'blog_id':Number($('#blog_id').val())
            },
            success:function (response){
                if(response.code === 200) {
                    page.val(Number(page.val()) + 1)
                    $.each(response.more_comments,function (index,item){
                        $("#moreArea").append(
                            `<li class="list-group-item">
                                <div class="comment">
                                    <div class="comment_meta text-body-secondary d-flex justify-content-between">
                                       <div class="command_user_info">
                                         <img width="30px" height="30px" src="${item.icon_url}" alt="">
                                         <span class="ms-1">${ item.author__username }</span>
                                       </div>
                                       <div class="comment_date">
                                           <span style="line-height: 30px">${formatDateTime(item.pub_time)}</span>
                                       </div>
                                     </div>
                                     <div class="comment_content my-3">
                                        ${item.content}
                                     </div>
                                </div>
                            </li>`
                        )
                    })
                    if(!response.has_more)$("#moreComment").remove()
                }else{
                    console.log(response.msg)
                }
            },
            error:function (){
                alert('error')
            }
        })
    }

    $('#comment').click(function (){
        $.ajax({
            url:'commentAPI',
            type:'post',
            dataType:'json',
            headers:{
                    "X-CSRFToken": window.CSRF_TOKEN
            },
            data:{
                'content':$('#comment_content').val(),
                'blog_id':Number($('#blog_id').val())
            },
            success:function (response){
                if(response.code === 200){
                    window.location.reload()
                }else if(response.code === 302) {
                    window.location.href = window.login
                }else{
                    console.log(response.msg)
                }
            },
            error:function (){
                alert('error')
            }
        })
    })
    $("#moreComment").click(function (){
        comment_request()
    })
    function formatDateTime(datetimeStr) {
        const date = new Date(datetimeStr);

        // 东八区时间调整（如果需要）
        const adjustedDate = new Date(date.getTime() + (8 * 60 * 60 * 1000));

        // 格式化为：YYYY年MM月DD日 HH:mm:ss
        const year = adjustedDate.getFullYear();
        const month = String(adjustedDate.getMonth() + 1).padStart(2, '0');
        const day = String(adjustedDate.getDate()).padStart(2, '0');
        const hours = String(adjustedDate.getHours()).padStart(2, '0');
        const minutes = String(adjustedDate.getMinutes()).padStart(2, '0');
        const seconds = String(adjustedDate.getSeconds()).padStart(2, '0');

        return `${year}年${month}月${day}日 ${hours}:${minutes}:${seconds}`;
    }

    comment_request();

})

